<script setup>
import { ref } from 'vue'
const myAlert = ref(null)

const clickTest = (event) => {
  console.log('clickTest', event);
}
const confirmAlert = () => {
  console.log('comfirmAlert');
}

const openAlert = () => {
  console.log(myAlert.value);

  myAlert.value.operateAlert(true)
}
</script>

<template>
  <h1>vue</h1>
  <YUButton @click="clickTest">default按钮</YUButton>
  <YUButton @click="clickTest" type="primary">primary按钮</YUButton>
  <YUButton @click="clickTest" type="success">success按钮</YUButton>
  <YUButton @click="clickTest" type="danger">danger按钮</YUButton>
  <YUButton @click="clickTest" type="warning">warning按钮</YUButton>
  <hr />
  <YUButton @click="openAlert" type="success">Open YUUI Alert</YUButton>

  <YUAlert ref="myAlert" @confirm="confirmAlert" type="success">
    <template v-slot:header>this is title for yusirxiaer alert</template>
    <template #content>this is content for yusirxiaer alert</template>
    <template #btnText>确认</template>
  </YUAlert>
</template>

<style>
</style>
